import { AfterViewInit, Component, Injector, OnDestroy, OnInit, ViewChild } from '@angular/core';
import { ConfigModule } from 'src/app/config.module';
import { SystemMenu } from '../../../../models/system/system-menu.model';
import { SystemMenuService } from '../service/system-menu.service';
import * as _ from 'lodash';
import { listAnimation } from '../../../../animations/list.animation';
import { BaseUI } from '../../../../common/base';
import { TreeUtils } from '../../../../utils/TreeUtils';
import { MenuOptionComponent } from '../component/menu-option/menu-option.component';
import { iconData } from '../../../../common/IconData';

@Component({
    selector: 'app-menu',
    templateUrl: './index.component.html',
    styleUrls: ['./index.component.scss'],
    animations: [listAnimation]
})
export class MenuComponent extends BaseUI implements OnInit, AfterViewInit, OnDestroy {

    modalLoadingState: boolean;
    saveLoadingState: boolean;
    searchObj:any = {
        menuName: '',
    };
    loadingState: boolean;
    total: number;
    entityTree: Array<SystemMenu> = []; //菜单列表数据
    expandState: boolean = false;
    constructor(
        public _config: ConfigModule,
        private _systemMenuService: SystemMenuService,
        private _injector: Injector,
    ) {
        super(_injector);
    }

    ngOnInit() {
        this.getSystemMenuListByPage();
    }

    ngAfterViewInit() {}

    ngOnDestroy() {}

    /**
     * 点击展开所有的节点
     */
    onExpandAll() {
        this.expandAll(this.entityTree, !this.expandState)
        this.expandState = !this.expandState;
    }

    /**
     * 展开全部的菜单节点
     */
    expandAll(array: any, status: boolean) {
        _.forEach(array, (item: { children: any; expand: boolean }) => {
            item.expand = status;
            if (item.children) {
                this.expandAll(item.children, status);
            }
        });
    }

    /**
     * 从菜单中移除项
     * @param array 菜单数组
     * @param key 删除的key
     */
    removeMenu(array: any, key: string) {
        _.forEach(array, (item: { children: any; key: string }, index) => {
            if (item.children) {
                if (item.key === key) {
                    array.splice(index, 1);
                }
            }
            this.removeMenu(item.children, key);
        });
    }


    /**
     * 获取菜单列表数据
     */
    getSystemMenuListByPage() {
        this.loadingState = true;
        this._systemMenuService.list(this.searchObj)
            .subscribe((res) => {
                if (res.success){
                    this.entityTree = TreeUtils.buildTree(res.data,'parentId','menuId',this.expandState);
                }else {
                    this.messageService.error(res.msg);
                }
            })
            .add(() => {
                this.setMiniTableHeight();
                this.loadingState = false;
            });
    }

    setMiniTableHeight() {
        let height = window.innerHeight -236;
        this.el.nativeElement.querySelector('.ant-table-body').style.maxHeight = height + 'px';
        this.el.nativeElement.querySelector('.ant-table-body').style.height = height+ 'px'
    }




    /**
     * 删除
     */
    onDelete(id: string, deleteRef: any) {
        deleteRef.innerHTML = this._config.loadingIcon;
        this._systemMenuService.delete(id).subscribe(
            (res) => {
                if (res.success) {
                    this.getSystemMenuListByPage();
                } else {
                    deleteRef.innerHTML = this._config.loadingIcon;
                }
            },
            () => {
                deleteRef.innerHTML = this._config.loadingIcon;
            }
        );
    }


    @ViewChild("menuOption")
    menuOption: MenuOptionComponent;
    protected readonly iconData = iconData;
    addMenu() {
        this.menuOption.onModalOpen("")
    }

    editMenu(id) {
        this.menuOption.onModalOpen(id)
    }


    keyEnter($event: KeyboardEvent) {
        if($event.key === 'Enter'){
            this.getSystemMenuListByPage();
        }
    }

    resetSearchObject() {
        this.searchObj = {
        };
    }
}
